/** Compass Sass utilities */
@import "compass/css3/border-radius"
@import "compass/css3/box-shadow"
@import "compass/css3/transform-legacy"

/** Our utilities for sass*/
@import "include/utils"

/** Buttons */
@import "include/buttons"

/** Main layout **/
html,body 
	background: #314660 !important
	font-family: Helvetica

body 
	width: 900px
	padding: 0 30px
	margin: auto

/** Blog header **/
#header 
	padding: 10px 0
	position: relative

#logo a 
	display: block
	height: 49px
	color: #fff
	font-size: 48px
	text-shadow: 1px 2px 2px #000
	text-decoration: none

#logo span 
	color: #f00
	font-size: 70%

#main 
	+gradient(#314660, #364B66)
	@include border-radius(16px)
	padding: 20px

/** Form **/
form 
	padding: 10px
	background-color: #253142
	@include border-radius(10px)

form .error 
	background: #c00
	color: #fff
	font-size: 90%
	padding: 3px 5px
	@include border-radius(6px)
	box-shadow: 0 2px 0 #800

form a.error 
	text-decoration: none

form div.item 
	margin: 5px 0 0 0
	border-bottom: 1px solid #314660
	padding-bottom: 10px

form div.item:last-child 
	border-bottom: none

form textarea 
	width: 70%
	height: 150px

form input,form textarea 
	font-size: 14px

form label 
	display: block
	font-weight: bold
	font-size: 90%
	color: #aaa
	margin-bottom: 3px

#captcha 
	display: block
	height: 50px

.success 
	background: #67AD10
	color: #fff
	padding: 10px
	@include border-radius(6px)
	-webkit-box-shadow: 0 2px 0 #4E840B
	
.tags-list .tag 
	cursor: pointer
	color: red

#adminMenu 
	list-style: none
	padding: 0
	padding-bottom: 10px
	margin: 0 0 20px 0
	border-bottom: 1px dashed #45597A
	margin: 0 0 20px 0
	text-align: center
	width: auto

#adminMenu li 
	display: inline-block
	margin-left: 15px

#adminMenu li:first-child 
	margin-left: 0	

#adminMenu li a 
	color: #869AB1
	text-decoration: none

#adminMenu li a:hover 
	color: white
	text-decoration: underline
	
/** My posts **/
#admin .post 
	background: #fff
	padding: 4px
	margin: 0
	font-size: 90%

#admin .post.odd 
	background: #C0CBE5

#admin .post a 
	color: #444

/** Image Uploading **/
#admin #listOfAllImages .thumbnail
	float: left
	text-align: center
	border:solid 1px #314660
	margin: 2px

#admin #listOfAllImages .thumbnail img
	height: 96px

#admin #listOfAllImages .thumbnail input
	font-size: 12px
	height: 15px
	padding-left: 2px
	padding-right: 2px
	width: 200px
	border: none
	border-top: 1px solid  #314660

#newPost 
	border-top: 1px dotted #C0CBE5
	padding-top: 15px

#postContent 
	width: 100%
	height: 300px

.hasError 
	background: pink

#tools 
	list-style: none
	margin: 0
	padding: 0
	position: absolute
	right: 0
	top: 30px
	right: 20px

#tools li 
	margin-left: 15px
	display: inline

#tools li:first-child 
	margin-left: 0

#tools a 
	color: #fff
	text-decoration: none

#tools a:hover 
	text-decoration: underline

#crudContent 
	color: #8B98AD

#crudContent h2 
	color: #EDC3CD !important

#crudContent thead tr 
	background: #512162 !important

#crudContent table 
	border: none !important

#crudContent table td 
	color: #444

tr.odd 
	background: #BECCE7 !important

#crud #crudContent,#crudContent form,#crudListSearch,#crudListPagination,.crudButtons
	background: transparent
	border: none
	padding: 0

#crudListTable 
	margin: 10px 0

.crudField,.objectForm 
	border: none
	padding-left: 0

.crudField label 
	color: #B8FA5C

.crudHelp 
	color: #fff !important

.crudField .tag 
	color: #111
	font-size: 80%

.crudButtons input 
	font-size: 110%

.crudButtons 
	margin-top: 20px
	border-top: 1px dotted #8B98AD
	padding-top: 10px

.crudFlash 
	border: 0
	@include border-radius(8px)
	font-size: 80%
	padding: 2px 10px

.crudField .tag.selected 
	@include border-radius(8px)

.crudField .error 
	background: transparent
	border: none
	padding: 0
	color: pink
	-webkit-box-shadow: none

/** Uploader */
#file-uploader-demo1 
	margin-top: 10px